<template>
  <div class="monitor-detail-redar">
  	<div class="monitor-moon-title detail-title">
		卫星
	</div>
	<div class="monitor-moon-content detail-content">
		<div v-for="(item, index) in moon">
			<div class="content-title detail-content-title">
				{{ item.title }}
			</div>
			<div class="content-lab detail-content-lab">
				<div  v-for="(items, indexs) in item.content" :title="items.name" @click="activeMoon(item, items)" :class="{active: items.active}">
					{{ items.name }}
				</div>
			</div>
		</div>
	</div>
	<div class="monitor-moon-close detail-close" @click="closeMoon">
		×
	</div>
	<common ref="common"></common>
  </div>
</template>

<script>
import common from '../common'
import {getMonitorMoon} from '../../mock/mockdata.js'
export default {
	props: {
		initTime: {
			type: String,
		}
	},
	data() {
		return {
			moon: [],
			storeMoon: {}
		}
	},
	components: {
		common
	},
	created() {
		this.moon = getMonitorMoon
		this.moon.forEach((obj) => {
			obj.content.forEach((data) => {
				if(data.active){
					this.storeMoon = data
				}
			})
		})
	},
	watch: {
		initTime: {
			handler: function(val, oldval) {
				this.getLastTime()
			}
		}
	},
	methods: {
		closeMoon() {
			this.$emit('close-moon')
		},
		activeMoon(data, res) {
			this.moon.forEach((obj) => {
				obj.content.forEach((data) =>{
					data.active = false
				})
			})
			res.active = true

			this.storeMoon = res
			this.getLastTime()
		},
		getLastTime() {
			let endTime = this.initTime.replace(/\-/g,'').replace(/\:/g,'').replace(' ','')
			let startTime = this.$refs.common.getTimeCShow(endTime, -24*60)
			let mapProductOptions = {
            	productcategory: this.storeMoon.type,
           	 	begintime: startTime,
            	endtime: endTime,
            	limit: 20
        	}
        	let that = this
        	let products = QXMap.GetMapProductList(mapProductOptions, function (data) {
        		//console.log(data)
        		that.$emit('moon-change', data.TimeList, that.storeMoon)
        	})
		}
	}
}
</script>

<style>

</style>
